<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    // 基本用法
    // // 实例化xhr异步对象
    let xhr = new XMLHttpRequest();
    // console.log("xhr属性与方法", xhr);
    // // 建立请求连接 ===请求类型 请求路径 
    // xhr.open("get", "abc.txt", true);
    // // 发送请求
    // xhr.send();
    // // 发送是否成功
    // xhr.onreadystatechange = function () {
    // //   http请求状态：0.1.2.3.4
    //   if (xhr.readyState == 4) {
    //     console.log(xhr.status);
    //     if (xhr.status == 200) {
    //         // 请求成功后响应内容
    //       console.log("响应内容", xhr.responseText);
    //     } else {
    //         // 请求失败给一个状态
    //       console.log("失败状态", xhr.status);
    //     }
    //   }
    // };

    // jQuery里ajax的封装用法
    // $.ajax({
    //   url: "abc.txt",
    //   method: "get",
    //   // 没有data数据所以咱暂时不需要
    //   // data
    //   // 请求时间
    //   // timeout:2000
    //   // 成功状态
    //   success: function (res) {
    //     console.log("响应内容", res);
    //   },
    //   // 错误状态
    //   error: function (err) {
    //     console.log("失败状态", err);
    //   },
    // });

    // 自己封装ajax
    // function Axios(method, url, fn) {
    //   let xhr = new XMLHttpRequest();
    //   xhr.open(method, url, true);
    //   xhr.onreadystatechange = function () {
    //     if (xhr.readyState == 4) {
    //       fn(xhr.responseText);
    //     } else {
    //       return xhr.status;
    //     }
    //   };
    // }
    // Axios("get", "abc.txt", function (res) {
    //   console.log("成功结果", res);
    // });
  </script>
</html>
